<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>


<script>
    var socket;
    if(window.WebSocket){
        //go on
        socket = new WebSocket("ws://localhost:8989/hello");
        //相当于channelRead0  接收服务器返回的信息
        socket.onmessage = function (ev) {
            var rt =document.getElementById("responseText");
            rt.value = rt.value+"\n"+ev.data;
        }
        //打开连接
        socket.onopen = function (ev) {
            var rt =document.getElementById("responseText");
            rt.value = rt.value+"连接开启1";
        }
        //关闭
        socket.onclose = function (ev) {
            var rt = document.getElementById("responseText");
            rt.value = "关闭连接"
        }
    }else{
        alert("当前浏览器不支持websocket编程")
    }

    //发送消息到服务器
    function send(message) {
        if(!window.socket){
            return ;
        }
        if(socket.readyState==WebSocket.OPEN){
            //可以发送  和之前handler中 TextWebSocketFar一样的格式 约定的格式
            socket.send(message);
        }else{
            alert("没有开启连接")
        }
    }

</script>
<form onsubmit="return false">
    <textarea id="message"  name="message" style="height: 300px; width: 300px"></textarea>
    <input type="button" value="send" onclick="send(this.form.message.value);document.getElementById('message').value=''">
    <textarea id ="responseText" style="height: 300px;width: 300px"></textarea>
    <input type="button" value="clear" onclick="document.getElementById('responseText').value=''">
</form>
</body>
</html>